
$(function () {

    $.ajax({
        type: 'GET',
        url: '/category/querySecondCategory',
        dataType: 'json',
        data: { id: 1 },
        success: function (data) {
            let str = ''
            for (let i of data.rows) {
                str += `<li class="mui-table-view-cell mui-media mui-col-xs-4">
                                <a href="#">
                                    <img class="mui-media-object" src="${i.brandLogo}">
                                    <div class="mui-media-body">${i.brandName}</div>
                                </a>
                            </li>`
            }


            $('.ul_body').html(str)
        },

    })


    $.ajax({
        type: 'GET',
        url: '/category/queryTopCategory',
        dataType: 'json',
        success: function (data) {
            let str = ``
            for (let i of data.rows) {
                if (i.id == 1) {
                    str += `
                    <li>
                        <button id='btn' data-loading-icon="mui-spinner mui-spinner-custom" class="mui-btn mui-btn-outlined btn_actived" data-id=${i.id}>
                            ${i.categoryName}
                        </button>
                    </li>
                    `
                } else {
                    str += `
                    <li>
                        <button id='btn' data-loading-icon="mui-spinner mui-spinner-custom" class="mui-btn mui-btn-outlined" data-id=${i.id}>
                            ${i.categoryName}
                        </button>
                    </li>
                    `
                }
            }
            $('.ul_head').html(str)
        },
    })
    $(document).on('tap', '#btn', (e) => {
        //移除高亮
        $('.btn_actived').removeClass('btn_actived')
        $(e.currentTarget).addClass('btn_actived')
        let str = ``
        $.ajax({
            type: 'GET',
            url: '/category/querySecondCategory',
            dataType: 'json',
            data: { id: e.currentTarget.dataset.id },
            success: function (data) {
                for (let i of data.rows) {
                    str += `<li class="mui-table-view-cell mui-media mui-col-xs-4">
                                <a href="#">
                                    <img class="mui-media-object" src="${i.brandLogo}">
                                    <div class="mui-media-body">${i.brandName}</div>
                                </a>
                            </li>`
                }


                $('.ul_body').html(str)
            },

        })

    })
})
